<template>
    <view class="cu-dialog">
        <view class="cu-bar bg-white justify-end solid-bottom">
            <view class="content">{{isUpdate?'修改':'添加'}}{{_Role[roleType]}}</view>
            <view class="action" @tap="hideModal">
                <text class="cuIcon-close text-red"></text>
            </view>
        </view>
        <view class="cu-form-group solid-bottom">
            <view class="title">{{_Role[roleType]}}姓名:</view>
           <picker @change="pickerChange($event, 'nameIndex')"  :value="defaultSelectMember" :range="member" range-key="MemberName">
                <view class="picker">
                    {{ member[nameIndex].MemberName }}
                </view>
            </picker>
			
			
        </view>
	
        <view class="cu-form-group ">
            <view class="title">{{_Role[roleType]}}性质:</view>
			<zf-select
				:list="_Property"
				:initValue="_Property[People.Property]"
				:showItemNum="5" 
				:isCanInput="false" 
				:placeholder = "'请选择性质'"
				:clearable="false"
				@change="propertyChange"
			></zf-select>		
			
        </view>		

        <view class="cu-form-group">
            <view class="title">是否是代理人</view>
            <view>
                <text class="text-green" v-if="People.IsAgent">是</text>
                <switch @change="SwitchA" :class="People.IsAgent?'checked':''" :checked="People.IsAgent?true:false">
                </switch>
                 <text class="text-grey" v-if="!People.IsAgent">否</text>
            </view>
        </view>	

        <view class="cu-form-group">
            <view class="title">通讯电话:</view>
            <input type="number" placeholder="请输入电话号码" v-model.trim="People.Phone"></input>
        </view>
        <view class="cu-form-group">
            <view class="title">通讯地址:</view>
            <input  placeholder="请输入详细地址" v-model.trim="People.Address"></input>
        </view>	
        <view class="cu-form-group solid-bottom">
            <view class="title">备注:</view>
            <input  placeholder="备注信息" v-model.trim="People.Remarks"></input>
        </view>	
        
        <view class="cu-bar bg-white solid-top">
            <view class="action margin-0 flex-sub  solid-left" @tap="hideModal">取消</view>
            <view class="action margin-0 flex-sub  text-blue solid-left " @tap="handleConfirm()">确定</view>
        </view>
    </view>
</template>

<script>
import { isvalidatemobile } from '@/common/utils/validate.js'
import { Property, Role } from '@/common/config/zft.js'
export default {
  
    // props: ['member', 'roleType', 'currentPeople'],
	props: {
		member: [Array],
		roleType: [Number, String],
		currentPeople: {
			type: Object,
			default: {}
		}
	},
    data () {
        return {
			value: 0,
            nameIndex: 0,
            propertyIndex: 0,
            /**
             *  1：权利人
                2：共有人
                3：监护人
                0：其它
             */
            // 角色
			_Role: Role,
			_Property: Property,
			People: {
                Userid: '',
                Address: '',
                Phone: '',
				Name: '',
                Remarks: '',
                Role: 1,
                Property: 1,
                IsAgent: false,
            },
			isUpdate: false
        }
    },
	computed: {
		defaultSelectMember() {
			if (!this.People.Userid) return 0
			let member = this.member
			for (let i = 0; i < member.length; i++) {
				if (member[i].MemberUserid == this.People.Userid) {
					return i
				}
			}
			return 0
		}
	},
	created () {
		if (this.currentPeople.Userid) {
			this.isUpdate = true
			this.People = Object.assign({}, this.People, this.currentPeople)
		}	
	},
	watch: {
		roleType(val) {
			this.People.Role = val
		},
		defaultSelectMember(val) {
			this.nameIndex = val
		}
	},
    methods: {
        hideModal(e) {
            this.modalName = null
            this.$emit('hideModal')
        },
        pickerChange(e, key) {
            this[key] = parseInt(e.detail.value)
        },
        handleConfirm() {
			console.log('this.member', this.member)
            this.People.Userid = this.member[this.nameIndex].MemberUserid        
			this.People.Role = this.roleType	
			this.People.Name = this.member[this.nameIndex].MemberName      
			console.log(' this.People: ', this.People)
			
            if (this.People.Phone) {
                let res = isvalidatemobile(this.People.Phone)
                console.log('验证手机 res: ', res)
                if (!res[0]) {
					this.showToast(res[1])
					return
                }
            }
			this.$emit('change', {
				data: this.People, 
				isUpdate: this.isUpdate,
				oldData: this.currentPeople
			})
			this.hideModal()

        },
        SwitchA(e) {
            this.People.IsAgent = e.detail.value
        },
		
		propertyChange(e) {
			this.People.Property = Number(e.val)
		}
    }
}
</script>

